{extend name="layout:base" /}
{block name="page_content"}
  <form class="form-horizontal adminform" id="model-form" method="post" action="">
    <div class="form-group">
      <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
        栏目名：<span class="red">*</span>
      </label>
      <div class="col-sm-10">
        <input type="text" name="title" placeholder="请输入栏目名" class="col-xs-10 col-sm-5" value="{$category.title|default=''}" required/>

      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
        英文名：<span class="red">*</span>
      </label>
      <div class="col-sm-10">
        <input type="text" name="name" placeholder="例：NEWS CENTER" class="col-xs-10 col-sm-5" value="{$category.name|default=''}" required/>

      </div>
    </div>
    <div class="space-4"></div>

    <div class="form-group">
      <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
        Banner图片：<span class="red">*</span>
        <br/>1020x400(宽x高)
      </label>
      <div class="col-sm-10">
        {:add_upload_image("pc_banner_id", 255, 100, $category['pc_banner_id'])}
      </div>
    </div>
    <div class="space-4"></div>

    <div class="clearfix form-actions">
      <div class="col-md-offset-3 col-md-9">
        <?php if(isset($category['id'])): ?>
          <input type="hidden" name="id" value="{$category.id}">
        <?php endif; ?>
        <button class="btn btn-info" type="submit">
          <i class="ace-icon fa fa-check bigger-110"></i>
          保存
        </button>

        &nbsp; &nbsp; &nbsp;
        <a class="btn" href="{:url('index')}">
          <i class="ace-icon fa fa-undo bigger-110"></i>
          返回
        </a>
      </div>
    </div>
  </form>
{/block}
{block name="page_js"}
  <script src="{$site_root}/static/plugins/jquery-validate/jquery.validate.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $("form#model-form").validate({
        'ignore': '',
        rules:{
          "title":{
            required: true,
            maxlength: 6
          }, "name":{
            required: true,
            maxlength: 50
          }, "pc_banner_id":{
            required: true,
            min: 1
          }
        },
        messages:{
          "title":{
            required: '栏目名不能为空',
            maxlength: '栏目名长度不能超过6个字符'
          }, "name":{
            required: '英文名不能为空',
            maxlength: '英文名长度不能超过50个字符'
          }, "pc_banner_id":{
            required: 'Banner图片不能为空',
            min: 'Banner图片不能为空'
          }
        },
        errorClass: "help-inline input-error",
        errorElement: "span",
        highlight:function(element, errorClass, validClass) {
          $(element).parents('.form-group').addClass('has-error');
        },
        unhighlight: function(element, errorClass, validClass) {
          $(element).parents('.form-group').removeClass('has-error');
          // $(element).parents('.form-group').addClass('success');
        },
        submitHandler: function(form){
          var $form = $(form);
          $.ajax({
            url: $form.attr("action"),
            type: $form.attr("method"),
            dataType: "JSON",
            data: $form.serialize(),
            success: function(data){
              if(data.code){
                location.href = data["url"];
              }else{
                alert(data["msg"]);
              }
            }, error: function () {
              alert("数据执行错误！");
            }
          });
        }
      });
    });
  </script>
{/block}